<template>
  <div class="ma-content-block lg:flex justify-between p-4">
    <!-- CRUD 组件 -->
    <ma-crud :options="options" :columns="columns" ref="crudRef">
      <template #goods_id="{ record }">
        <div>{{ record.goods_id == 0?record.box_type_name:record.goods_name }}</div>
      </template>
    </ma-crud>
  </div>
</template>
<script setup>
import { ref, reactive,defineProps,onMounted } from 'vue'
import financialGoodsPriceDetail from '@/api/financial/financialGoodsPriceDetail'
import { Message } from '@arco-design/web-vue'
import tool from '@/utils/tool'
import * as common from '@/utils/common'

const crudRef = ref()
const props = defineProps({
    info:{
        default: {},
    }
  })
  onMounted(()=>{
    crudRef.value.requestData()
  })
const numberOperation = (newValue, id, numberName) => {
  financialGoodsPriceDetail.numberOperation({ id, numberName, numberValue: newValue }).then( res => {
    res.success && Message.success(res.message)
  }).catch( e => { console.log(e) } )
}

const switchStatus = (statusValue, id, statusName) => {
  financialGoodsPriceDetail.changeStatus({ id, statusName, statusValue }).then( res => {
    res.success && Message.success(res.message)
  }).catch( e => { console.log(e) } )
}


const options = reactive({
  id: 'flyos_financial_goods_price_detail',
  rowSelection: {
    showCheckedAll: true
  },
  pk: 'id',
  operationColumn: true,
  autoRequest:false,
  operationWidth: 160,
  formOption: {
    viewType: 'modal',
    width: 600
  },
  api: financialGoodsPriceDetail.getList,
  recycleApi: financialGoodsPriceDetail.getRecycleList,
  add: {
    show: true,
    api: financialGoodsPriceDetail.save,
    auth: ['financial:goodsPriceDetail:save']
  },
  edit: {
    show: true,
    api: financialGoodsPriceDetail.update,
    auth: ['financial:goodsPriceDetail:update']
  },
  delete: {
    show: true,
    api: financialGoodsPriceDetail.deletes,
    auth: ['financial:goodsPriceDetail:delete'],
    realApi: financialGoodsPriceDetail.realDeletes,
    realAuth: ['financial:goodsPriceDetail:realDeletes']
  },
  recovery: {
    show: true,
    api: financialGoodsPriceDetail.recoverys,
    auth: ['financial:goodsPriceDetail:recovery']
  },
  import: {
    show: true,
    url: 'financial/goodsPriceDetail/import',
    templateUrl: 'financial/goodsPriceDetail/downloadTemplate',
    auth: ['financial:goodsPriceDetail:import']
  },
  export: {
    show: true,
    url: 'financial/goodsPriceDetail/export',
    auth: ['financial:goodsPriceDetail:export']
  },
  beforeRequest:(params)=>{
    params.price_id = props.info.id
  },
  beforeAdd:(params)=>{
    params.price_id = props.info.id
    return true
  },
  beforeOpenEdit:(e)=>{
    const service =  crudRef.value.getColumnService()
    if(e.goods_id > 0){
      e.type = 1
      service.get('goods_id').setAttr('editDisplay', true)
      service.get('box_type_id').setAttr('editDisplay', false)
    }else if(e.box_type_id > 0){
      e.type = 2
      service.get('goods_id').setAttr('editDisplay', false)
      service.get('box_type_id').setAttr('editDisplay', true)
    }
    return true
  }
})

const columns = reactive([
  {
    title: "",
    dataIndex: "id",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    commonRules: {
      required: true,
      message: "请输入"
    }
  },
  {
    title: "主Id",
    dataIndex: "price_id",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true
  },
  {
    title: "类型",
    dataIndex: "type",
    formType: "radio",
    hide: true,
    dict: {
      data:[{
        value:1,
        label:'品名'
      },{
        value:2,
        label:'集装箱'
      }]
    },
    onChange: (val) => {
        const service =  crudRef.value.getColumnService()
        if (val == 1) {
            service.get('goods_id').setAttr('display', true)
            service.get('box_type_id').setAttr('display', false)
        }
        if (val == 2) {
            service.get('goods_id').setAttr('display', false)
            service.get('box_type_id').setAttr('display', true)
        }
    },
    addDefaultValue:1,
    commonRules: {
      required: true,
      message: "请选择类型",
    },
  },
  {
    title: "品名",
    dataIndex: "goods_id",
    formType: "select",
    search: true,
    dict: {
      url: "goods/manage/index",
      params: {
        page: 1,
        pageSize: 2500
      },
      props: { label: "name", value: "id" },
      translation: true,
    },
    editDisplay:false,
    commonRules: {
      required: true,
      message: "请选择品名",
    },
  },
  {
    title: "集装箱",
    dataIndex: "box_type_id",
    formType: "select",
    dict: {
      url: "prediction/boxManage/index",
      params: {
        page: 1,
        pageSize: 2500
      },
      props: { label: "name", value: "id" },
      translation: true,
    },
    addDisplay:false,
    editDisplay:false,
    commonRules: {
      required: true,
      message: "请选择集装箱",
    },
  },
  
  {
    title: "装卸费率",
    dataIndex: "goods_price",
    formType: "input",
    search: true
  },
  {
    title: "创建时间",
    dataIndex: "created_at",
    formType: "date",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    showTime: true
  },
  {
    title: "更新时间",
    dataIndex: "updated_at",
    formType: "date",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    showTime: true
  },
  {
    title: "删除时间",
    dataIndex: "deleted_at",
    formType: "date",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    showTime: true
  },
  {
    title: "创建者",
    dataIndex: "created_by",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true
  },
  {
    title: "更新者",
    dataIndex: "updated_by",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true
  }
])
</script>
<script> export default { name: 'financial:goodsPriceDetail' } </script>